import { mapGetters } from 'vuex'

export default {
	computed: {
		// 将m_cart模块的getter映射为页面的计算属性
		...mapGetters('m_cart', ['total'])
	},
	watch: {
		// 由于商品数量输入框以及删除商品都会引起商品总数变化，因此购物车tab页的数字角标也需要同步变化
		total() {
			this.setPageBadge()
		}
	},
	methods: {
		// 定义设置页面角标方法
		setPageBadge() {
			// 页面首次载入或删除所有商品后，移除tab页角标
			if (this.total === 0) {
				uni.removeTabBarBadge({
					index: 2
				})
			} else {
				// 否则设置购物车tab页角标
				uni.setTabBarBadge({
					index: 2,
					text: String(this.total),
				})
			}

		}
	},
	onShow() {
		// 调用设置当前页面角标函数
		this.setPageBadge()
	},
}
